<%@page import="java.util.Date"%>
<%@ page language="java" contentType= "text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		
		<title>商户手机注册</title>
		<!-- Path to Framework7 Library CSS-->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/f7/framework7.ios.min.css">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/f7/framework7.ios.colors.min.css">
		<!-- Path to your custom app styles-->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/f7/my-app.css">
		
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-1.8.3.js"></script> 
		<script type='text/javascript' src='${pageContext.request.contextPath}/dwr/engine.js'></script>
		<script type='text/javascript' src="${pageContext.request.contextPath}/dwr/util.js"></script>
		<script type='text/javascript' src='${pageContext.request.contextPath}/dwr/interface/customerRegisterService.js'></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/idcardutil.js"></script>
	</head>
	<body>
	<form  method="post"   id="formR" >
						<input type="hidden" id="customerId" name="id" value="${customer.id}"/>
						<input type="hidden" id="customerNo" name="customerNo" value="${customer.customerNo}"/>
						<input type="hidden" id="muExistsFlag" name="muExistsFlag" value=""/>
						<input type="hidden" id="accTypeFlag" name="accTypeFlag" value="INDIVIDUAL"/>
						<input type="hidden" name="phoneNoOptType" value="regist"/>
						<input type="hidden" id="terminalTypeId" name="terminalTypeId" value="${terminalTypeId}"/>
						<input type="hidden" id="openId" name="openId" value="${openId}"/>
						</form>
		<div class="views">
			<div class="view view-main">
				<div class="pages">
						<!-- 首页 手机号码验证码注册 -->
						<div data-page="pageCheckPhoneNo" class="page">
							<div class="page-content">
								<div class="mf-header">
									<div class="mf-header-inner">
										<table>
											<tr>
												<td rowspan="3">
													<div class="mf-header-img">
														<input type="hidden" name="headimgurl" value="${headimgurl}" />
														<input type="hidden" name="sex" value="${sex}" />
														<img src="${headimgurl}" width="80px" height="80px"/>
													</div>
												</td>
											</tr>
											<tr>
												<td style="padding-left:15px;">
													<input type="hidden" name="nickname" value="${nickname}" />
													<span style="font-size: 20px">	${nickname}</span>
												</td>
											</tr>
											<tr>
												<td   style="padding-left:15px;">
													<input type="hidden" name="country" value="${country}" />
													<input type="hidden" name="province" value="${province}" />
													<input type="hidden" name="city" value="${city}" />
													<input type="hidden" id="activationCode" name="activationCode" value="${activationCode}" />
													<span id="weChatUserAddress" style="font-size: 20px;"><img  src="${pageContext.request.contextPath}/image/location.png" />&nbsp;&nbsp;${country}&nbsp;&nbsp;${province}&nbsp;&nbsp;${city}</span>
												</td>
											</tr>
										</table>
									</div>
								</div>
								<div class="list-block">
									<ul>
										<li>
											<div class="item-content">
							           			<div class="item-inner"> 
							                		<div class="item-input">
							                  			<input class="myFields" type="tel" name="mobile" id="mobile" value="" placeholder="请输入手机号码"/>
							                		</div>
							              		</div>
							            	</div>
							          	</li>
							          	<li>
							            	<div class="item-content">
							              		<div class="item-inner"> 
							                		<div class="item-input">
							                  			<input class="myFields"  type="tel" name="valiCode" id="valiCode" value="" placeholder="请输入验证码"/>
							                		</div>
							                		<div class="item-input" style="border:1px solid #c8c7cc;width:0px;height:30px;"></div>
							                		<div class="item-input" style="width:200px;">
							                			<a href="#" id="getValiCodeBtn"  class="list-button item-link mf-nopadding disabled">获取验证码</a>
							               			</div>
							              		</div>
							            	</div>
										</li>
									</ul>
								</div>
								<div class="list-block mf-noborder">
									<ul>
										<li>
											<label class="label-checkbox item-content" style="padding-left: 3px;">
												<input type="checkbox" class="myFields" name="agreeCkb" id="agreeCkb"  checked="checked" />
												<div class="item-media"><i class="icon icon-form-checkbox"></i></div>
												<div class="item-inner" style="margin-left:0px;padding-right: 0px;">
													<div class="item-title">
														<table>
															<tr>
																<td>我已经阅读并同意</td>
																<td><a href="${pageContext.request.contextPath}/consult.html" id="getValiCodeBtn" data-popup=".popup-about1" class="list-button item-link open-popup" style="padding:0;">《服务协议》</a></td>
															</tr>
														</table>
													</div>
													<a href="${pageContext.request.contextPath}/image/f7/registerGuide1.png" data-popup=".popup-about2"class="list-button item-link open-popup" >注册指引</a>
													
												</div>
											</label>
										</li>
									</ul>
								</div>
								<div class="list-block mf-noborder">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-inner mf-noborder">
													<div class="item-input">
														<a href="#" id="nextStepBtn" class="button button-big button-fill color-mfblue disabled" >下一步</a>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
							</div>
						</div>
						
						<!-- 重设密码页面 -->
						<div class="page  cached" data-page="pageResetPswd" >
							<div class="page-content">
								<div class="content-block"></div>
								<div class="list-block">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-password"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myPswd" type="password" name="password" id="password"  value="" autocomplete="off" placeholder="输入密码"/>
													</div>
												</div>
											</div>
										</li>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-password"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myPswd" type="password" name="passwordConfirm" id="passwordConfirm" value=""   autocomplete="off" placeholder="再次确认密码"/>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
								<div class="content-block" style="margin-top:10px">密码由6-12位英文字母、数字组成</div>
								<div class="list-block mf-noborder">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-inner mf-noborder">
													<div class="item-input">
														<a href="#" id="resetPswdNextStepBtn" class="button button-big button-fill color-mfblue disabled" >下一步</a>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
							</div>
						</div>
						
						<!-- 填写商户基本信息页面 -->
						<div class="page  cached" data-page="pageCusBaseInfo" >
							<div class="page-content">
								<div class="list-block" style="margin-bottom:10px;margin-top:10px;">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-shop"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myBaseInfo" type="text" name="cusName" id="cusName" value="" placeholder="商户名称"/>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
								<div class="list-block" style="margin-bottom:10px;">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-usrname"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myBaseInfo" type="text" name="cusLgPson" id="cusLgPson" value="" placeholder="法人姓名"/>
														 <input type="hidden" id="userId" name="userId" value="" />
													</div>
												</div>
											</div>
										</li>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-idno"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myBaseInfo" type="text" name="cusIDNo" id="cusIDNo" value="" placeholder="法人身份证号"/>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
								<div class="list-block" style="margin-bottom:10px;">
									<ul>
										<li id="provinceSelectLi">
											<a href="#" class="item-link smart-select" id="ss-cusbaseinfo-province" data-back-text="返回" data-back-on-select="true">
												<select class="myBaseInfo mySelect" id="cusProvince" name="cusProvince" ></select>
												<div class="item-content">
													<div class="item-media"><i class="icon icon-form-lc-basic"></i></div>
										       		<div class="item-inner">
										            	<div class="item-title">所在地区省</div>
										            	<!-- Additional "smart-select-value" class to set selected option depending on this text value -->
										            	<div class="item-after smart-select-value">请选择</div>
										          	</div>
										        </div>
											</a>
										</li>
										<li id="citySelectLi">
											<a href="#" class="item-link smart-select" id="ss-cusbaseinfo-city" data-back-text="返回" data-back-on-select="true">
												<select class="myBaseInfo mySelect" id="cusCity" name="cusCity"><option value="">请选择</option></select>
												<div class="item-content">
													<div class="item-media"><i class="icon icon-form-lc-district"></i></div>
										       		<div class="item-inner">
										            	<div class="item-title">所在地区市</div>
										            	<!-- Additional "smart-select-value" class to set selected option depending on this text value -->
										            	<div class="item-after smart-select-value" id="cityText">请选择</div>
										          	</div>
										        </div>
											</a>
										</li>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-lc-detail"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input  class="myBaseInfo" type="text" name="cusAddress" id="cusAddress" value="" placeholder="详细地址"/>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
								<div class="list-block" style="margin-bottom:10px;">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-camera"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myBaseInfo" type="file" id="cusIDFront" capture="camera" accept="image/*" name="cusIDFront"/>
														<input id="cusIDFront_Show" readonly="readonly"  type="text"  value="" placeholder="上传身份证正面照"/>
													</div>
												</div>
											</div>
										</li>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-camera"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myBaseInfo" type="file" id="cusIDBack" name="cusIDBack"/>
														<input id="cusIDBack_Show" readonly="readonly"  type="text"  value="" placeholder="上传身份证背面照"/>
													</div>
												</div>
											</div>
										</li>
										<li>
											<div class="item-content">
												<div class="item-media"><i class="icon icon-form-camera"></i></div>
												<div class="item-inner">
													<div class="item-input">
														<input class="myBaseInfo" type="file" id="cusHoldIDFront" name="cusHoldIDFront"/>
														<input id="cusHoldIDFront_Show" readonly="readonly"  type="text"  value="" placeholder="上传手持身份证正面照"/>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
								<div class="list-block mf-noborder">
									<ul>
										<li>
											<div class="item-content">
												<div class="item-inner mf-noborder">
													<div class="item-input">
														<a href="#pageCusSettleInfo" onclick="javascript:document.title='绑定银行卡';" id="baseInfoNextStepBtn" class="button button-big button-fill color-mfblue disabled" >下一步</a>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
							</div>
						</div>
						
						<!-- 填写结算信息页面 -->
						<div class="page  cached" data-page="pageCusSettleInfo" >
							<div class="page-content">
								<div class="tabs">
									<div class="toolbar tabbar mf-tab">
										<div class="toolbar-inner">
											<a href="#tab1" class="tab-link active"><table><tr ><td><i class="icon icon-tab-p"></i></td><td>个人账户</td></tr></table></a>
											<a href="#tab2" class="tab-link"><table><tr><td><i class="icon icon-tab-e"></i></td><td>企业账户</td></tr></table></a>
										</div>
									</div>
									<div class="list-block">
										<ul>
											<li>
												<div class="item-content">
													<div class="item-media"><i class="icon icon-form-accname"></i></div>
													<div class="item-inner">
														<div class="item-input">
															<input class="mySettleAccInfo" type="text" name="cusSettleAccName" id="cusSettleAccName" value="" placeholder="持卡人姓名" readonly="readonly"/>
														</div>
													</div>
												</div>
											</li>
											<li>
												<div class="item-content">
													<div class="item-media"><i class="icon icon-form-creditcard"></i></div>
													<div class="item-inner">
														<div class="item-input">
															<input class="mySettleAccInfo" type="text" name="cusSettleAccNo" id="cusSettleAccNo" value="" placeholder="银行卡号"/>
														</div>
													</div>
												</div>
											</li>
											<li>
												<a href="#" class="item-link smart-select"  data-back-text="返回" data-back-on-select="true">
													<select class="mySettleAccInfo mySelect" id="cusSettleAccBank" name="cusSettleAccBank">
														<option value="">请选择</option>
														<c:forEach var="list" items="${bankList}">
														  <option value="${list.id}">${list.name}</option>
														</c:forEach>
													</select>
													<div class="item-content">
														<div class="item-media"><i class="icon icon-form-bank"></i></div>
											       		<div class="item-inner">
											            	<div class="item-title">开户行</div>
											            	<!-- Additional "smart-select-value" class to set selected option depending on this text value -->
											            	<div class="item-after smart-select-value">请选择</div>
											          	</div>
											        </div>
												</a>
											</li>
											<li id="provinceSelectLi">
												<a href="#" class="item-link smart-select" id="ss-cussettleinfo-province" data-back-text="返回" data-back-on-select="true">
													<select class="mySettleAccInfo mySelect" id="cusSettleProvince" name="cusSettleProvince"></select>
													<div class="item-content">
														<div class="item-media"><i class="icon icon-form-lc-basic"></i></div>
											       		<div class="item-inner">
											            	<div class="item-title">所在地区省</div>
											            	<!-- Additional "smart-select-value" class to set selected option depending on this text value -->
											            	<div class="item-after smart-select-value">请选择</div>
											          	</div>
											        </div>
												</a>
											</li>
											<li id="citySelectLi">
												<a href="#" class="item-link smart-select" id="ss-cussettleinfo-city" data-back-text="返回" data-back-on-select="true">
													<select class="mySettleAccInfo mySelect" id="cusSettleCity" name="cusSettleCity"></select>
													<div class="item-content">
														<div class="item-media"><i class="icon icon-form-lc-district"></i></div>
											       		<div class="item-inner">
											            	<div class="item-title">所在地区市</div>
											            	<!-- Additional "smart-select-value" class to set selected option depending on this text value -->
											            	<div class="item-after smart-select-value" id="settle_cityText">请选择</div>
											          	</div>
											        </div>
												</a>
											</li>
											<li id="openBankSelectLi">
												<a href="#" class="item-link smart-select" id="ss-cussettleinfo-openbank" data-back-text="返回" data-back-on-select="true" data-searchbar="true">
													<select class="mySettleAccInfo mySelect" id="cusSettleAccBankName" name="cusSettleAccBankName"></select>
													<div class="item-content">
														<div class="item-media"><i class="icon icon-form-bankname"></i></div>
											       		<div class="item-inner">
											            	<div class="item-title" style="min-width: 90px;">开户行名称</div>
											            	<!-- Additional "smart-select-value" class to set selected option depending on this text value -->
											            	<div class="item-after smart-select-value" id="settle_openBankText">请选择</div>
											          	</div>
											        </div>
												</a>
											</li>
										</ul>
									</div>
									<div id="tab1" class="tab active">
										<div class="list-block" style="margin-top:15px;margin-bottom:10px;">
											<ul>
												<li>
													<div class="item-content">
														<div class="item-media"><i class="icon icon-form-camera"></i></div>
														<div class="item-inner">
															<div class="item-input">
																<input class="mySettleAccInfo"  type="file" name="cusHoldCardFront" id="cusHoldCardFront"/>
																<input id="cusHoldCardFront_Show" readonly="readonly"  type="text"  value="" placeholder="手持银行卡正面照"/>
															</div>
														</div>
													</div>
												</li>
											</ul>
										</div>
									</div>
									<div id="tab2" class="tab">
										<div class="list-block" style="margin-top:15px;margin-bottom:10px;">
											<ul>
												<li>
													<div class="item-content">
														<div class="item-media"><i class="icon icon-form-camera"></i></div>
														<div class="item-inner">
															<div class="item-input">
																<input class="mySettleAccInfo"  type="file" name="cusBizLisence" id="cusBizLisence"/>
																<input id="cusBizLisence_Show" readonly="readonly"  type="text"  value="" placeholder="开户许可证"/>
															</div>
														</div>
													</div>
												</li>
											</ul>
										</div>
									</div>
									<div class="list-block mf-noborder">
										<ul>
											<li>
												<div class="item-content">
													<div class="item-inner mf-noborder">
														<div class="item-input">
															<a href="#" id="settleInfoSubmitBtn" class="button button-big button-fill color-mfblue disabled" >提交</a>
														</div>
													</div>
												</div>
											</li>
										</ul>
									</div>
								</div>
							</div>
						</div>
				</div>
			</div>
		</div>
		<div class="popup popup-about1" style="display: none;">
	      <div class="view navbar-fixed">
	        <div class="pages">
	          <div class="page">
	            <div class="navbar">
	              <div class="navbar-inner">
	                <div class="center" style="left: 111.5px;">微商服务协议</div>
	                <div class="right"><a href="#" class="link close-popup">确认</a></div>
	              </div>
	            </div>
	            <div class="page-content">
	              <iframe src="${pageContext.request.contextPath }/consult.html" width="100%" height="100%" style="border: 0;"></iframe>
	            </div>
	          </div>
	        </div>
	      </div>
	    </div>
	    <div class="popup popup-about2">
    		<div class="view navbar-fixed">
		        <div class="pages">
		          <div class="page">
		            <div class="navbar">
		              <div class="navbar-inner">
		    			 <div class="center" style="left: 111.5px;">注册指引</div>
			        	 <div class="right"><a href="#" class="link close-popup">确认</a></div>
		              </div>
		            </div>
						<div class="page-content">
			              	<img src="${pageContext.request.contextPath}/image/f7/registerGuide1.png" class="img"></img>
			            </div>
			          </div>
			        </div>
			      </div>
			    </div>
		<!-- Path to Framework7 Library JS-->
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/f7/framework7.min.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/dist/lrz.all.bundle.js"></script>
		<!-- Path to your app js-->
		<%-- <script type="text/javascript" src="${pageContext.request.contextPath}/js/mobileBUGFix.mini.js"></script>--%>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/LocalResizeIMG.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/f7/my-app.js?<%=new Date().getTime()%>"></script>
  	</body>
</html>